<template>
  <div class="static-card">
  <!-- 记录统计卡片 -->
    <div class="static-title">{{titleInfo.title}}</div>
    <div class="late-user-icon">
      <img src="~images/common/user_danger.png" />
    </div>
    <div class="late-clock-icon">
      <img src="~images/default/statis_temper.png" class="temper-img" v-if=" waterMarking === 'temper'" />
      <img src="~images/common/richeng.png" v-else />
    </div>
    <div class="late-back-total">{{info.manNum | formateStatisTotal}}</div>
    <div class="total-area">
      <span class="late-back-points">{{info.average | formateStatisTotal}}</span>
      <span class="late-back-senc"></span> <!-- 小数点之后 -->
      <span class="time-unit-text">{{titleInfo.unit}}</span>
    </div>
    <div class="average-title">{{titleInfo.numText}}</div>
    <div class="late-tatal-title">{{titleInfo.avageText}}</div>
    <div class="theme-title-bg">
        <img src="~images/watermark/water_mark_late_dark.png" v-if="waterMarking === 'late'" />
        <img src="~images/watermark/water_mark_access_dark.png" v-if="waterMarking === 'access'" />
        <img src="~images/watermark/water_mark_temper_dark.png" v-if="waterMarking === 'temper'" />
      </div>
  </div>
</template>
<script>
export default {
  props: {
    waterMarking: {
      type: String,
      default: 'late',
    },
    titleInfo: {
      type: Object,
      default: ()=> {},
    },
    info: {
      type: Object,
      default: ()=> {},
    },
  },
}
</script>
<style lang="scss" scoped>
@import "~styles/default/statis_card.scss";
</style>
